<template>
	<uni-popup ref="popup" :animation="true" style="width: 100%;">
		<view class="succntbox">
			<image class="suctitimg" :src="IMGLink + '/activities/suctitimg.png'"></image>
			<view class="suctit" v-if="obj">{{obj.level > 0 ? '签到成功' : '签到奖励'}}</view>
			<view class="suc_add" v-if="obj">
				签到第{{obj.days}}天，{{obj.level > 0 ? '' : '将获得'}}
				<image class="coin_icon" :src="IMGLink + '/activities/coin_icon.png'">
				</image>
				<text class="add_coin_text">+{{obj.coin}}</text>
			</view>
			<button class="suc_sure" v-if="obj && obj.level == 0" @click="_signin" type="default">确认签到</button>
			<button class="suc_sure" v-else @click="_closeFun" type="default">确认</button>
			<button v-if="obj && obj.level == 0" class="suc_sure" style="margin-top: 40rpx;" @click="_linkTo"
				type="default">双倍领取</button>
			<icon class="close" type="clear" size="26" @click="_closeFun" />
		</view>
	</uni-popup>
</template>

<script>
	import {
		signInFun
	} from "@/api/act/act.js"
	export default {
		data() {
			return {
				IMGLink: this.IMGLink,
				obj: null
			}
		},
		methods: {
			showFun(obj) {
				this.obj = obj
				this.$refs.popup.open()
			},
			_closeFun() {
				this.$refs.popup.close()
			},
			_linkTo() {
				uni.navigateTo({
					url: "/pagesA/my/vips/myvip"
				})
				this._closeFun()
			},
			_signin() {
				signInFun().then(res => {
					this.$store.dispatch("updateUserInfo")
					this.$emit("back")
					this._closeFun()
				}).catch(err => {
					console.log(err)
				})
			}
		}
	}
</script>

<style scoped>
	.signsuc {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, .6);
		z-index: 1000;
	}

	.succntbox {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -40%);
		z-index: 1;
		width: 562rpx;
		height: auto;
		background-color: white;
		border-radius: 26rpx;
		padding-bottom: 20px;
	}

	.suctitimg {
		display: block;
		margin: 48rpx auto 0;
		width: 180rpx;
		height: 180rpx;
	}

	.suctit {
		margin: 40rpx auto 34rpx;
		color: #000000;
		font-size: 32rpx;
		text-align: center;
	}

	.coin_icon {
		margin: 0 6rpx;
		width: 40rpx;
		height: 36rpx;
	}

	.add_coin_text {
		color: #F54642;
	}

	.suc_add {
		text-align: center;
	}

	.suc_sure {
		margin: 62rpx auto 0;
		width: 370rpx;
		height: 72rpx;
		line-height: 72rpx;
		text-align: center;
		background: #F54642;
		border-radius: 36rpx;
		color: white;
		font-size: 28rpx;
	}

	.close {
		position: absolute;
		bottom: -72rpx;
		left: 50%;
		transform: translate(-50%, 0);
	}
</style>
